<template>
	<view>
		<view class="list">
			<text class="title">银行名称</text>
			<input type="text" placeholder="请选择" />
			<image src="https://hosue-omo.oss-cn-shenzhen.aliyuncs.com/assets/rightIcon.png" mode="" class="more_icon"></image>
		</view>
			<view class="line" />
		<view class="list">
			<text class="title">银行卡号</text>
			<input type="text" placeholder="请输入" />
		</view>
			<view class="line" />
		<view class="list">
			<text class="title">持卡人名字</text>
			<input type="text" placeholder="请输入" />
		</view>
			<view class="line" />
		<view class="list">
			<text class="title">预留手机号</text>
			<input type="text" placeholder="请输入" />
		</view>
		<text class="tip">*为了您的提现到帐顺畅，请填写正确的银行卡信息</text>
		<view class="bottom_box">
			<view class="add_btn">
				确认添加
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive
	} from 'vue'
	const list = reactive([{}])
</script>
<style>
	page {
		background: #F6F6F6 !important;
	}
</style>
<style lang="less" scoped>
	.list {
		display: flex;
		align-items: center;
		padding: 30rpx;
		background: #FFFFFF;
		position: relative;
		.title {
			font-family: PingFangSC-Regular;
			font-size: 28rpx;
			color: #333333;
			font-weight: 400;
			width: 140rpx;
			text-align: left;
		}

		input {
			font-size: 28rpx;
		}
		.more_icon{
			position: absolute;
			right: 30rpx;
			top: 34rpx;
			width: 24rpx;
			height: 40rpx;
		}
	}
	.line{
		background: #eeeeee;
		height: 1rpx;
		margin: 0 30rpx;
	}
	.tip{
		font-family: PingFangSC-Regular;
		font-size: 24rpx;
		color: #666666;
		font-weight: 400;
		padding-left: 30rpx;
		margin-top: 30rpx;
	}
	.bottom_box{
		position: fixed;
		bottom: 0;
		left: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 30rpx 0;
		background: #FFFFFF;
		width: 100%;
		.add_btn{
			width: 626rpx;
			height: 90rpx;
			line-height: 90rpx;
			background-image: linear-gradient(270deg, #F1B13F 0%, #F8D648 100%);
			border-radius: 50rpx;
			font-family: PingFangSC-Regular;
			font-size: 32rpx;
			color: #FFFFFF;
			text-align: center;
			font-weight: 400;
		}
	}
</style>